<template>
  <div class="footer">
    <b class="icp">
      <span>网站备案号：</span>
      <a target="_blank" :href="'https://beian.miit.gov.cn/#/Integrated/recordQuery?q=' + icpNumber">{{ icpNumber }}</a>
    </b>
    <b>{{ docTitle }}(2017 - {{ nowYear }}) &copy; Coding By Fenglinz</b>
  </div>
</template>
<script setup>
  import { ref, onMounted } from 'vue';

  const docTitle = ref('');
  const icpNumber = ref('');
  const nowYear = ref(new Date().getFullYear());

  onMounted(() => {
    docTitle.value = window.settings.title;
    icpNumber.value = window.settings.icpNo;
  });
</script>
<style lang="less" scoped>
  .footer {
    background-color: #fff;
    line-height: 32px;
    display: inline-block;
    width: 100%;
    text-align: left;
    vertical-align: middle;
    border-radius: 5px;
    padding: 10px 15px;

    > img {
      width: 28px;
      height: 28px;
    }
  }

  .icp {
    margin-right: 15px;
    font-weight: bold;
    cursor: pointer;
  }
</style>
